<template>
	<view class="a-page">
		<a-nav-bar>
			<q-btn color="negative" label="清缓存" @click="store.清缓存" />
		</a-nav-bar>

		<q-card class="fit q-mt-md">
			<q-card-section class="row justify-between no-wrap">
				<view class="row q-gutter-md">
					<a-ziduan :编辑="true" :单项="a" 字段名="每小时台球费" width="140" />
					<a-ziduan :编辑="true" :单项="a" 字段名="最小计费分钟数" width="140" />
				</view>

			</q-card-section>
		</q-card>

		<q-card class="fit q-mt-md">
			<q-card-section class="row">
				<uni-forms-item label="添加常用客户">
					<uni-easyinput v-model="客户" placeholder="请输入……" v-enter-key="添加客户" suffixIcon="checkmarkempty"
						@iconClick="iconClick" />
				</uni-forms-item>
				<view class="row q-gutter-md">
					<view class="row relative-position" v-for="item in a.客户组">
						<q-chip color="primary" outline text-color="white" :label="item">
						</q-chip>
						<q-btn round size="xs" dense color="negative" icon="close" @click="删客户(item)"
							class="absolute-top-right z-50" />
					</view>
				</view>
			</q-card-section>
		</q-card>

	</view>
</template>

<script setup>
	import {
		ref,
		reactive,
		computed
	} from 'vue';
	import * as util from '@/amtf/utils'

	import useshezhistore from "@/stores/shezhi-store"
	const store = useshezhistore()
	const { a } = store

	const 客户 = ref("")

	function iconClick(e) {
		添加客户()
	}

	function 删客户(item) {
		util.删除元素(a.客户组,item)
	}

	function 添加客户() {
		a.客户组.push(客户.value)
	}
</script>